<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">

    <body>
        <ui:composition template="../templateRecepcion/template.xhtml">
            <ui:define name="content">
                <h:form id="formularioAgendarCitasSeleccionClienteID" styleClass="form" >
                    <p:remoteCommand  name="iniciarDatos"
                                      process="@this"
                                      update="formularioAgendarCitasSeleccionClienteID"
                                      action="#{agendarCitasSeleccionClienteControlador.iniciarDatos()}"/>
                    <p:growl id="messages" autoUpdate="true" />
                    <p:panel id="panelBusquedaClienteID" styleClass="panel" header="Busquedas">
                        <h:panelGrid styleClass="panelGridAnchoTotal" columns="2">
                            <f:facet name="header">
                                <p class="facetAlineadoIzquierda"> Medico: #{agendarCitasSeleccionClienteDataManager.prestador.nombreComercial} - Fecha: #{agendarCitasSeleccionClienteDataManager.fechaSeleccionadaParaCitaFormateada} </p>
                            </f:facet>
                            <h:panelGrid columns="2" styleClass="panelGridCuarentaPorCiento">
                                <p:commandButton  value="Volver" icon="ui-icon-arrowreturnthick-1-w" action="agendarCitas?faces-redirect=true"
                                                  process="@this"  styleClass="comandButton"
                                                  onclick="mostrarEspera();" oncomplete="ocultarEspera()">
                                    <f:setPropertyActionListener target="#{agendarCitasDataManager.prestador}" value="#{agendarCitasSeleccionClienteDataManager.prestador}"/>
                                </p:commandButton>
                                <p:commandButton  value="Seleccionar Medico" icon="ui-icon-home"
                                                  process="@this" onclick="PF('dialogMedicosWV').show()" styleClass="comandButton"/>
                            </h:panelGrid>
                        </h:panelGrid>
                        <h:panelGrid styleClass="panelGridAnchoTotal" columns="2">
                            <f:facet name="header">
                                <p class="facet"> Busqueda de Clientes </p>
                            </f:facet>
                            <h:panelGrid columns="2" styleClass="panelGridCuarentaPorCiento">
                                <h:outputLabel value="Identificacion:" styleClass="outPutLabel"/>
                                <p:inputText value="#{agendarCitasSeleccionClienteDataManager.parametrosBusquedaClienteUtil.identificacion}" 
                                             styleClass="inputText"/>

                                <h:outputLabel value="Apellido Paterno:" styleClass="outPutLabel"/>
                                <p:inputText value="#{agendarCitasSeleccionClienteDataManager.parametrosBusquedaClienteUtil.apellidoPaterno}" 
                                             styleClass="inputText"
                                             onkeyup="javascript:this.value=this.value.toUpperCase();"/>

                            </h:panelGrid>
                            <h:panelGrid columns="2" styleClass="panelGridCuarentaPorCiento">
                                <h:outputLabel value="Nombre:" styleClass="outPutLabel"/>
                                <p:inputText value="#{agendarCitasSeleccionClienteDataManager.parametrosBusquedaClienteUtil.nombreCliente}" 
                                             styleClass="inputText"
                                             onkeyup="javascript:this.value=this.value.toUpperCase();"/>

                                <h:outputLabel value="Apellido Materno:" styleClass="outPutLabel"/>
                                <p:inputText value="#{agendarCitasSeleccionClienteDataManager.parametrosBusquedaClienteUtil.apellidoMaterno}" 
                                             styleClass="inputText"
                                             onkeyup="javascript:this.value=this.value.toUpperCase();"/>
                            </h:panelGrid>
                        </h:panelGrid>
                        <p:separator styleClass="separator"/>
                        <h:panelGrid columns="2" styleClass="panelGridAnchoTotal" >

                            <p:commandButton  value="Buscar" icon="ui-icon-search" update="panelResultadosBusquedaClienteID"
                                              process="panelBusquedaClienteID"  styleClass="comandButton"
                                              action="#{agendarCitasSeleccionClienteControlador.buscarCliente()}"/>
                            <p:commandButton  value="Limpiar" icon="ui-icon-arrowrefresh-1-e" update=":formularioAgendarCitasSeleccionClienteID"
                                              process="@this"  styleClass="comandButton"
                                              action="#{agendarCitasSeleccionClienteDataManager.limpiarValores()}">
                            </p:commandButton>

                        </h:panelGrid>
                    </p:panel>
                    <p:panel id="panelResultadosBusquedaClienteID" 
                             styleClass="panel" header="Resultados">
                        <p:dataTable value="#{agendarCitasSeleccionClienteDataManager.clientesEncontrados}" 
                                     var="cliente" 
                                     paginator="true"
                                     rows="5"
                                     emptyMessage="No existen datos"
                                     paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}" >
                            <p:column headerText="Identificacion">
                                <h:outputText value="#{cliente.cedula}"/>  
                            </p:column>
                            <p:column headerText="Nombre">
                                <h:outputText value="#{cliente.nombre}"/>  
                            </p:column>
                            <p:column headerText="Apellidos">
                                <h:outputText value="#{cliente.apellidosCompletos}"/>  
                            </p:column>
                            <p:column headerText="Seleccionar">
                                <p:commandLink value="Seleccionar" 
                                               process="@this"  
                                               update=":formularioAgendarCitasSeleccionClienteID:dialogIngresoDatosCitaID"
                                               oncomplete="PF('dialogDatosCitaWV').show()">
                                    <f:setPropertyActionListener target="#{agendarCitasSeleccionClienteDataManager.clienteSeleccionado}"
                                                                 value="#{cliente}"/>
                                    <f:setPropertyActionListener target="#{agendarCitasSeleccionClienteDataManager.deshabilitarGuardar}"
                                                                 value="#{false}"/>
                                </p:commandLink>
                            </p:column>
                        </p:dataTable>
                    </p:panel> 

                    <!-- dialogo -->
                    <p:dialog id="dialogIngresoDatosCitaID" widgetVar="dialogDatosCitaWV" header="Horario de la cita" 
                              showEffect="clip" hideEffect="clip" modal="true" 
                              styleClass="dialog"
                              resizable="false" closable="false"> 
                        <p:panel styleClass="panel">
                            <p:growl id="messagesDialogID" autoUpdate="true"/>
                            <h:panelGrid columns="2" styleClass="panelGridAnchoTotal" >
                                <h:outputLabel value="Fecha:" styleClass="outPutLabel"/>
                                <h:outputLabel value="#{agendarCitasSeleccionClienteDataManager.fechaSeleccionadaParaCitaFormateada}" styleClass="outPutLabel"/>

                                <h:outputLabel value="Medico:" styleClass="outPutLabel"/>
                                <h:outputLabel value="#{agendarCitasSeleccionClienteDataManager.prestador.nombreComercial}" styleClass="outPutLabel"/>

                                <h:outputLabel value="Cliente:" styleClass="outPutLabel"/>
                                <h:outputLabel value="#{agendarCitasSeleccionClienteDataManager.clienteSeleccionado.nombre} #{agendarCitasSeleccionClienteDataManager.clienteSeleccionado.apellidosCompletos}" styleClass="outPutLabel"/>

                                <h:panelGrid columns="2" styleClass="panelGridAnchoTotal" >
                                    <f:facet name="header">
                                        <p class="facetAlineadoIzquierda"> Hora Inicial</p>
                                    </f:facet>
                                    <h:outputLabel value="Hora:" styleClass="outPutLabel"/>
                                    <p:selectOneMenu  value="#{agendarCitasSeleccionClienteDataManager.horaSeleccionadaInicial}" 
                                                      styleClass="selectOneMenu" 
                                                      required="true" requiredMessage="Hora Obligatorio">  
                                        <f:selectItems value="#{agendarCitasSeleccionClienteControlador.horas}" />

                                    </p:selectOneMenu>

                                    <h:outputLabel value="Minuto:" styleClass="outPutLabel"/>
                                    <p:selectOneMenu  value="#{agendarCitasSeleccionClienteDataManager.minutoSeleccionadoInicial}" 
                                                      styleClass="selectOneMenu" 
                                                      required="true" requiredMessage="Minutos Obligatorios">  
                                        <f:selectItems value="#{agendarCitasSeleccionClienteControlador.minutos}" />

                                    </p:selectOneMenu>
                                </h:panelGrid>

                                <h:panelGrid columns="2" styleClass="panelGridAnchoTotal" >
                                    <f:facet name="header">
                                        <p class="facetAlineadoIzquierda">Hora Fin</p>
                                    </f:facet>
                                    <h:outputLabel value="Hora:" styleClass="outPutLabel"/>
                                    <p:selectOneMenu  value="#{agendarCitasSeleccionClienteDataManager.horaSeleccionadaFinal}" 
                                                      styleClass="selectOneMenu" 
                                                      required="true" requiredMessage="Hora Obligatorio">  
                                        <f:selectItems value="#{agendarCitasSeleccionClienteControlador.horas}" />

                                    </p:selectOneMenu>

                                    <h:outputLabel value="Minuto:" styleClass="outPutLabel"/>
                                    <p:selectOneMenu  value="#{agendarCitasSeleccionClienteDataManager.minutoSeleccionadoFinal}" 
                                                      styleClass="selectOneMenu" 
                                                      required="true" requiredMessage="Minutos Obligatorios">  
                                        <f:selectItems value="#{agendarCitasSeleccionClienteControlador.minutos}" />

                                    </p:selectOneMenu>
                                </h:panelGrid>


                            </h:panelGrid>
                            <p:separator styleClass="separator"/>

                            <h:panelGrid columns="2" styleClass="panelGridAnchoTotal" >
                                <p:commandButton value="Guardar" action="#{agendarCitasSeleccionClienteControlador.crearCita()}" 
                                                 process="dialogIngresoDatosCitaID"
                                                 oncomplete="this.disable=true;" update="@this"
                                                 disabled="#{agendarCitasSeleccionClienteDataManager.deshabilitarGuardar}"
                                                 styleClass="comandButton"
                                                 icon="ui-icon-disk"/>
                                <p:commandButton value="Cerra Ventana" onclick="PF('dialogDatosCitaWV').hide()"
                                                 styleClass="comandButton" process="@this"
                                                 icon="ui-icon-circle-close"/>

                            </h:panelGrid>
                        </p:panel>
                    </p:dialog>

                    <p:dialog id="dialogMedicosID" widgetVar="dialogMedicosWV" header="Medicos" 
                              showEffect="clip" hideEffect="clip" modal="true" 
                              styleClass="dialog" resizable="false" closable="false">
                        <p:panel styleClass="panel">
                            <h:panelGrid columns="1" styleClass="panelGridAnchoTotal" >
                                <p:dataTable value="#{agendarCitasSeleccionClienteControlador.prestadores}" 
                                             var="prestador" 
                                             paginator="true"
                                             rows="5"
                                             paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}" >

                                    <p:column headerText="Medico">
                                        <h:outputText value="#{prestador.nombreComercial}"/>  
                                    </p:column>
                                    <p:column headerText="Seleccionar">
                                        <p:commandLink value="Seleccionar" process="@this" onclick="PF('dialogMedicosWV').hide()"
                                                       update=":formularioAgendarCitasSeleccionClienteID">
                                            <f:setPropertyActionListener value="#{prestador}" target="#{agendarCitasSeleccionClienteDataManager.prestador}"/>
                                        </p:commandLink>
                                    </p:column>

                                </p:dataTable>

                            </h:panelGrid>
                        </p:panel>

                    </p:dialog>

                </h:form> 
            </ui:define>
        </ui:composition>
    </body>
</html>